Easy2Siksha Sample Paper
GNDU Most Repeated (Important) Quesons
BCA 5th Semester
Web Technologies (2021–2024)
Must-Prepare Quesons (80–100% Probability)
SECTION–A
1. Dierences between Client-Side and Server-Side Programming; give languages
and examples (3 mes)
2. Features / Advantages of HTML 5 (3 mes)
3. CSS3 selectors and styling features (1 me, likely repeat)
2025 Smart Predicon Table
Based on 4-Year GNDU Paper Analysis (2021–2024)
SECTION-A (HTML, CSS, JS Fundamentals)
Queson Topic
Repeats
Years Appeared
Priority
Client-Side vs Server-Side Programming
(examples & languages)
3 Times
2021 (Q2), 2022 (Q1),
2023 (Q1)
Very
High
HTML 5 Features / Advantages
3 Times
2022 (Q1), 2023 (Q1
paral), 2024 (Q1)
Very
High
Easy2Siksha Sample Paper
Queson Topic
Repeats
Years Appeared
Priority
CSS3 Selectors & Styling
1 Time
2022 (Q2)
High
2025 GUARANTEED QUESTIONS (100% Appearance)
TOP 5 QUESTIONS – MUST PREPARE
1. Client-Side vs Server-Side Programming — languages & examples (3/4 years)
2. HTML 5 Features & Advantages; Mulmedia tags (3/4 years)
GNDU Most Repeated (Important) Answer
BCA 5th Semester
Web Technologies (2021–2024)
Must-Prepare Quesons (80–100% Probability)
SECTION–A
1. Dierences between Client-Side and Server-Side Programming; give languages
and examples (3 mes)
Ans: Imagine you’re sitting in your favorite café, sipping a hot cup of coffee, and you
decide to order a dessert from their online menu. You open your phone, type the café’s
website address, and within seconds, a beautiful page appears — showing images,
prices, and descriptions of cakes, pastries, and ice creams. You click on a chocolate
truffle cake, and it instantly pops up with a message, “Added to cart!”
Easy2Siksha Sample Paper
Now, have you ever wondered — how did that happen so fast? How did the website
know what to show you, and where did all that data come from?
Well, this magical coordination between what you see on your screen and what happens
behind the scenes is the perfect example of Client-Side and Server-Side Programming
working together — like two friends playing in perfect rhythm.
Let’s understand this beautiful relationship step by step — not through complicated
technical jargon, but like a simple, flowing story you can imagine and enjoy.
Step 1: Meet the Two Heroes – The Client and the Server
Think of the Client as you, the user who sends a request — maybe by clicking a button or
typing a website address.
The Server, on the other hand, is like the café’s chef sitting in the kitchen — receiving
your order, preparing it, and sending it back to you beautifully arranged on a plate.
So, when you visit a website:
• The Client (your browser: Chrome, Edge, or Safari) asks for something.
• The Server (a computer far away) processes that request and sends back the data
— maybe a webpage, images, or information.
Now, depending on where the action happens — on your device (client) or the server
(remote computer) — we call it Client-Side Programming or Server-Side Programming.
Step 2: What is Client-Side Programming?
Imagine you’re reading an online menu. You click on the “Show more details” button,
and instantly, extra information about the dish appears — without the page reloading.
That quick and smooth effect is made possible by Client-Side Programming.
In simple words, Client-Side Programming happens inside your web browser.
It controls what you see, how it looks, and how it behaves when you click, scroll, or
type.
Key Features of Client-Side Programming:
1. Runs on the user’s device (browser) — not on the web server.
Easy2Siksha Sample Paper
2. Handles interface and interactivity — how buttons, forms, animations, and
visuals behave.
3. Faster response — because actions like clicking or expanding menus don’t need
to contact the server.
4. Uses web technologies like HTML, CSS, and JavaScript.
Step 3: Languages Used in Client-Side Programming
Here are the main languages that bring the front-end (the visible part of a website) to
life:
1. HTML (HyperText Markup Language):
This is the skeleton of any web page. It defines the structure — where headings,
paragraphs, images, and links go.
Example: Think of HTML as the frame of your café menu — the sections, titles,
and item lists.
2. CSS (Cascading Style Sheets):
CSS is the artist. It adds colors, fonts, layouts, and overall beauty to the page.
Example: CSS gives your menu style — fancy fonts, background color, and elegant
design.
3. JavaScript:
JavaScript is the magician who brings the page to life — making buttons clickable,
images slide, and forms validate user input.
Example: When you type your name in an order form and it immediately says
“Name can’t be empty!” — that’s JavaScript at work.
Example of Client-Side Activity
Let’s imagine you’re filling out an online form to order your cake.
You type your name but forget to enter your phone number.
Before even sending the form, a small red message appears: “Please enter your phone
number.”
This quick check happens instantly because your browser (client-side script) handled it
— without asking the server.
Easy2Siksha Sample Paper
That’s Client-Side Programming — fast, interactive, and visual.
Step 4: What is Server-Side Programming?
Now, imagine after filling out your cake order form, you click Submit.
This time, your browser sends all the details — your name, address, and order — to a
server.
The Server is like a busy kitchen where:
• Orders are received.
• Recipes (code logic) are followed.
• Cakes (data) are prepared and sent back.
In simple words, Server-Side Programming handles what happens behind the scenes.
It deals with storing data, authenticating users, and delivering the right information to
the right person.
Key Features of Server-Side Programming:
1. Runs on the server (not the user’s computer).
2. Manages logic, database, and security.
3. Sends processed data back to the client.
4. Slower than client-side for small actions because it needs communication with
the server.
5. Ensures safety — as sensitive operations happen privately on the server.
Step 5: Languages Used in Server-Side Programming
Here’s the toolbox that powers the server:
1. PHP:
One of the oldest and most widely used server languages. Used in WordPress and
Facebook’s early development.
Example: When you log in to your account, PHP checks your username and
password from the database.
2. Python (with Django or Flask):
A modern, easy-to-learn language that’s both powerful and flexible.
Example: Many AI and data-driven websites use Python for handling logic.
3. Node.js:
Interestingly, it uses JavaScript — but on the server side!
Easy2Siksha Sample Paper
Example: Real-time chat applications like WhatsApp Web use Node.js to handle
messages.
4. Java:
A strong, secure language used in banking and enterprise systems.
Example: When you do online banking, Java often works behind the scenes
ensuring secure transactions.
5. Ruby on Rails, .NET, C#, and others:
These also help servers manage large, complex web systems efficiently.
Step 6: Example of Server-Side Activity
Continuing our café story —
Once you click Submit Order, the server receives your details.
It then:
• Checks if your payment is successful,
• Finds the nearest branch,
• Confirms your order in the database, and
• Sends back a message — “Order confirmed! Your cake will arrive soon.”
All this happens behind the scenes, quietly and efficiently.
That’s Server-Side Programming — the backbone of web functionality.
Step 7: Key Differences Between Client-Side and Server-Side Programming
Let’s summarize everything with a simple, clear comparison:
Feature
Client-Side Programming
Server-Side Programming
Where it runs
In the user’s browser
On the web server
Main purpose
Display, design, and interaction
Processing, logic, and database
handling
Speed
Faster (no server communication
needed for small actions)
Slower (depends on network
and server response)
Security
Less secure (code visible to users)
More secure (code hidden from
users)
Languages
Used
HTML, CSS, JavaScript
PHP, Python, Java, Node.js,
Ruby
Access to
Database
No direct access
Full access
Easy2Siksha Sample Paper
Examples
Form validation, animations,
interactive menus
Login systems, storing user
data, payment processing
Step 8: How They Work Together – The Perfect Partnership
The real magic happens when both sides cooperate.
Let’s revisit your cake order journey:
1. Client-Side (Front-End) shows the beautiful menu, images, and form for you to
fill.
2. Server-Side (Back-End) stores your order, checks payment, and updates the
database.
3. Finally, Client-Side again shows a success message like “Your order is on the
way!”
Without client-side code, the web would be plain and boring.
Without server-side code, the web would be empty and powerless.
Together, they make the internet interactive, functional, and alive.
Step 9: Real-Life Analogy
Let’s simplify it one last time with a real-life analogy:
• Client-Side = The Restaurant Menu & Waiter
→ You see the dishes, talk to the waiter, and make your choices.
• Server-Side = The Kitchen & Chef
→ They prepare your food based on your order and send it out when ready.
Just as both waiter and chef are essential in a restaurant, both client-side and server-
side are crucial in a website.
Step 10: Why This Division Matters
This clear separation helps developers build powerful, secure, and smooth websites:
• Designers focus on Client-Side to make it beautiful and easy to use.
• Developers focus on Server-Side to make it efficient and safe.
Easy2Siksha Sample Paper
That’s why modern web development often uses frameworks that connect both sides
seamlessly — like React (client-side) and Node.js (server-side) — creating dynamic, real-
time web applications.
Conclusion: Two Sides of the Same Coin
So next time you browse a website, remember — what you see is only half the story.
Behind every smooth animation, instant button click, or login page, there’s a quiet
conversation happening between your browser and a distant server.
Client-Side Programming makes the experience delightful and responsive.
Server-Side Programming ensures that everything functions correctly, safely, and
intelligently.
Together, they create the digital world we live in — just like the waiter and chef
together create the perfect dining experience.
2. Features / Advantages of HTML 5 (3 mes)
Ans: The Story of HTML5: The Language That Shaped the Modern Web
It was the early 2000s. The internet was growing rapidly, but websites were clunky. To
watch a video, you needed a plugin like Flash. To play a simple game, you had to install
extra software. Even something as basic as embedding audio required complicated
workarounds.
Then, in 2014, a new hero arrived: HTML5. It wasn’t just a small update to the old
HTML—it was a revolution. Suddenly, videos could play directly in the browser,
animations could run smoothly, and websites could behave almost like mobile apps.
Developers cheered, users smiled, and the web entered a new era.
This is the story of HTML5, its features, and its advantages—told in a way that makes it
easy to understand and enjoyable to read.
Part I: What is HTML5?
HTML stands for HyperText Markup Language. It is the standard language used to
create and structure web pages.
Easy2Siksha Sample Paper
• HTML4 was the older version, widely used in the early 2000s.
• HTML5 is the fifth and latest major version, designed to meet the needs of
modern web applications.
In simple words: HTML5 is like the grammar of the internet. Just as grammar helps
us write meaningful sentences, HTML5 helps developers write meaningful web pages.
Part II: Features of HTML5
Let’s explore the key features of HTML5, one by one, with real-life analogies and
examples.
1. Semantic Elements
HTML5 introduced new tags that describe the meaning of content.
Examples:
• <header> for page headers
• <footer> for footers
• <article> for articles
• <section> for sections
• <nav> for navigation menus
Analogy: Imagine a newspaper. Instead of just saying “text block,” HTML5 now says
“this is the headline,” “this is the article,” “this is the advertisement.” It makes the
structure clearer.
Advantage: Improves readability for both developers and search engines (SEO).
2. Audio and Video Support
Before HTML5, embedding audio or video required plugins like Flash. Now, it’s as simple
as:
html
<video src="movie.mp4" controls></video>
<audio src="song.mp3" controls></audio>
Analogy: Earlier, you needed a separate DVD player to watch movies. Now, your TV
has everything built-in.
Advantage: Faster, safer, and more user-friendly multimedia integration.
3. Canvas Element
Easy2Siksha Sample Paper
The <canvas> element allows drawing graphics, animations, and even games directly in
the browser using JavaScript.
Analogy: It’s like giving artists a blank canvas where they can paint anything—charts,
games, or animations.
Advantage: Eliminates the need for external tools like Flash.
4. SVG (Scalable Vector Graphics) Support
HTML5 supports SVG, which allows scalable graphics that don’t lose quality when
zoomed.
Analogy: Like a logo that looks sharp whether it’s on a business card or a billboard.
Advantage: Perfect for responsive designs and high-resolution displays.
5. Geolocation API
HTML5 allows websites to access the user’s location (with permission).
Example: Google Maps asking for your location.
Advantage: Enables location-based services like ride-hailing apps, weather updates, and
local search.
6. Offline Storage (Web Storage & Application Cache)
• LocalStorage: Stores data permanently in the browser.
• SessionStorage: Stores data temporarily for a session.
Analogy: Like saving notes in a diary (localStorage) vs. writing on a whiteboard that
gets erased when you leave (sessionStorage).
Advantage: Websites can work offline or remember user preferences without needing
cookies.
7. Responsive Design with Media Queries
HTML5 works seamlessly with CSS3 to create responsive websites that adapt to different
screen sizes.
Analogy: A shirt that fits perfectly whether you wear it at age 10 or 20.
Advantage: Essential for mobile-friendly websites.
Easy2Siksha Sample Paper
8. Form Enhancements
HTML5 introduced new input types:
• email
• date
• number
• range
• color
Example: <input type="email"> automatically validates email format.
Advantage: Reduces the need for extra JavaScript validation.
9. Improved Accessibility
Semantic tags and ARIA (Accessible Rich Internet Applications) support make websites
more accessible to people with disabilities.
Example: Screen readers can better understand page structure.
Advantage: Promotes inclusivity and compliance with accessibility standards.
10. WebSockets
HTML5 introduced WebSockets for real-time communication between client and server.
Example: Live chat applications or stock market updates.
Advantage: Faster and more efficient than traditional HTTP requests.
11. Microdata and SEO Improvements
HTML5 supports microdata, which helps search engines understand content better.
Example: Marking up a recipe with ingredients and cooking time.
Advantage: Improves search engine ranking and rich snippets.
12. Cleaner and Simpler Syntax
HTML5 removed unnecessary elements like <font> and encourages cleaner code.
Analogy: Like cleaning your room—less clutter, more clarity.
Advantage: Easier to read, write, and maintain.
Easy2Siksha Sample Paper
Part III: Advantages of HTML5
Now that we’ve seen the features, let’s summarize the advantages.
1. Cross-Platform Compatibility
HTML5 works on all modern browsers and devices—desktops, tablets, and smartphones.
2. No Need for Plugins
Videos, audio, and animations run natively without Flash or Silverlight.
3. Better User Experience
Responsive design, multimedia support, and offline storage make websites smoother
and more interactive.
4. SEO-Friendly
Semantic elements and microdata improve search engine visibility.
5. Faster Development
Built-in form validation, multimedia tags, and APIs reduce the need for external libraries.
6. Future-Proof
HTML5 is designed to evolve with the web, ensuring long-term relevance.
7. Accessibility
Improved support for screen readers and assistive technologies.
8. Performance
WebSockets, canvas, and local storage improve speed and reduce server load.
Part IV: Real-Life Applications of HTML5
• YouTube: Uses HTML5 video player.
• Google Maps: Uses geolocation and canvas.
• Twitter & Facebook: Use HTML5 for responsive design and multimedia.
• E-commerce Sites: Use form enhancements and offline storage.
Storytelling Recap
Let’s return to our story.
Easy2Siksha Sample Paper
Aarohi, the student, rebuilt her project using HTML5. She used <header> and <footer> to
structure her pages. She embedded videos of lectures directly with <video>. She made
her site responsive so it looked good on both laptops and phones. She even added
offline storage so students could access notes without internet.
When she presented it, her professor smiled and said, “This is not just a project. This is
the future of the web.”
Conclusion
HTML5 is more than just a version update—it is the foundation of the modern web.
• It introduced semantic elements for clarity.
• It added multimedia support without plugins.
• It enabled graphics, geolocation, offline storage, and real-time communication.
• It made websites responsive, accessible, and SEO-friendly.
In short, HTML5 transformed the internet from a static collection of pages into a
dynamic, interactive, and intelligent platform.
